Change the background color of selected text in Google Docs to increase readability [migrated]

Posted by gene_wood on Super User See other posts from Super User or by gene_wood
Published on 2012-03-29T00:44:34Z Indexed on 2012/03/29 17:34 UTC
Read the original article Hit count: 201

Filed under:
|

How can I override or change the background color of text selected in Google Docs? It is difficult for me to see the difference and I would like to increase the contrast or difference.

After Google restyled Google Docs last year (or earlier this year), I've been unable to see selected text. It's possible this is a visual deficiency with my eyes. In Google Docs, under both Google Chrome (17.0.963.83 (Official Build 127885) m) and Firefox (11.0), when I select text inside a Google Doc, the selected text has a background of color #d6e0f5.

Compare this to the default browser background color of #2f65c0. (I determined the color of the selected text background by taking a screenshot and using the color picker tool in Photoshop). I've tested this using a brand new Firefox profile as well as google chrome profile.

Here's a section of a screenshot showing the selected text :

some words highlighted to see difference

I've tried using a userscript to override the CSS to go back to the default text selection color using the "Stylish" plugin with this css :

::selection {
 background:#2f65c0;
 color:#ffffff;
}

::-moz-selection {
 background:#2f65c0;
 color:#ffffff;
}

::-webkit-selection {
 background:#2f65c0;
 color:#ffffff;
}

This code works on other sites, but I'm unable to get it to work on Google Docs. (I tested on other sites but applying the userscript to a different domain and using bright yellow instead of the default dark blue #2f65c0.)

When you use Google Docs, do you have the same color background for selected text or something different? (To test this, browse to docs.google.com , create a document, type text into the document, select the text with the mouse by dragging over it, take a screenshot, load the screenshot up in an image editor and determine the background color of the selected text.)

This color differential (between light blue #d6e0f5 and white #fffff) may be easy to see for others and the problem lies with my eyes.

© Super User or respective owner

Related posts about css

Related posts about google-docs